feat: disable mui tabs indicator animation

[amhsirak]

Summary by CodeRabbit

• Style
  • Removed the visual tab indicator from the vertical menu navigation in the dashboard, providing a cleaner interface while preserving all existing menu functionality and navigation behavior.

[coderabbitai]

Walkthrough

A CSS styling modification to MainMenu.tsx hides the visual indicator on a Material-UI vertical Tabs component by adding a display:none rule to its sx prop. No behavioral or navigation logic changes.

Changes

Cohort / File(s)	Summary
UI Styling Update src/components/dashboard/MainMenu.tsx	Added CSS rule '& .MuiTabs-indicator': { display: 'none' } to the Tabs component's sx prop to hide the indicator element

Estimated code review effort

🎯 1 (Trivial) | ⏱️ ~3 minutes

Suggested labels

Scope: UI/UX

Poem

🐰 A rabbit hops through designs so fine,
Hiding indicators with a CSS line,
No tabs shall glow, no stripes appear,
Clean visual edges, crystal clear! ✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check	✅ Passed	The pull request title "feat: disable mui tabs indicator animation" is clearly and specifically related to the main change in the changeset. The summary confirms that the modification involves the MUI Tabs indicator in MainMenu.tsx, where a CSS rule is added to hide it. The title accurately captures the core change—the indicator is being disabled/removed from view. While the implementation uses display: 'none' (which hides the element entirely) rather than specifically disabling animation, this is a reasonable interpretation of "disabling animation" since the indicator becomes invisible and non-interactive. The title is concise, avoids noise, and clearly communicates the primary change to anyone reviewing the commit history.
Docstring Coverage	✅ Passed	No functions found in the changes. Docstring coverage check skipped.

✨ Finishing touches

• 📝 Generate docstrings

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Post copyable unit tests in a comment
• Commit unit tests in branch disable-ripple

---

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between ce45b83 and e2e2a7f.

📒 Files selected for processing (1)

• src/components/dashboard/MainMenu.tsx (1 hunks)

🧰 Additional context used

🪛 Biome (2.1.2)

src/components/dashboard/MainMenu.tsx

[error] 90-100: This JSX property is assigned multiple times.

This attribute is assigned again here.

(lint/suspicious/noDuplicateJsxProps)

🔇 Additional comments (2)

src/components/dashboard/MainMenu.tsx (2)

84-91: Verify that tab selection remains clear without the indicator.

The change successfully hides the indicator, aligning with the minimal visual feedback design (all tabs have disableRipple={true}). However, this completely removes the indicator rather than just disabling its animation.

Please confirm that the selected tab state is still visually distinguishable through other means (e.g., color, background, or typography changes). Also note that the indicatorColor="primary" prop on line 88 is now redundant and could be removed.

---

90-98: Static analysis false positive: sx props are on different components.

The Biome linter incorrectly flags duplicate sx properties. The sx on line 90 belongs to the Tabs component, while the sx on line 98 belongs to a Tab child component. This is valid and intentional.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}