feat: tweak login UI

[dinhlongviolin1]

Describe Your Changes

• Make login section menu looks better

Fixes Issues

• Closes #
• Closes #

Self Checklist

• Added relevant comments, esp in complex areas
• Updated docs (for bug fixes / features)
• Created issues for follow-up changes or refactoring needed

---

Important

Enhance login UI with improved dropdown menu styling and responsive design adjustments.

• UI Enhancements:
  • Adjust z-index in DropdownMenuContent and DropdownMenuSubContent to z-[51] in dropdown-menu.tsx for better layering.
  • Add border separator in LeftPanel for authentication menu.
• Responsive Design:
  • Use ResizeObserver in AuthLoginButton and UserProfileMenu to adjust dropdown width based on aside panel width.
  • Update useEffect in LeftPanel.tsx to handle panel open/close on screen resize.
• Code Improvements:
  • Add useCallback for scrollToBottom and handleScroll in useThreadScrolling.tsx for better performance.
  • Add useCallback for fetchUserData and resetAppData in AuthProvider.tsx to optimize re-renders.

^{This description was created by for 4ba99e1. You can customize this summary. It will automatically update as commits are pushed.}

[ellipsis-dev]

Caution

Changes requested ❌

Reviewed everything up to 8c13b9d in 2 minutes and 21 seconds. Click for details.

• Reviewed 215 lines of code in 4 files
• Skipped 0 files when reviewing.
• Skipped posting 4 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. web-app/src/components/ui/dropdown-menu.tsx:44

• Draft comment:
  Changed z-index from z-50 to z-[51] in DropdownMenuContent. Verify that this stacking adjustment doesn’t interfere with other UI overlays.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50% None

2. web-app/src/components/ui/dropdown-menu.tsx:232

• Draft comment:
  Updated z-index to z-[51] for DropdownMenuSubContent. Ensure the new layering behaves as expected in all cases.
• Reason this comment was not posted:
  Confidence changes required: 33% <= threshold 50% None

3. web-app/src/containers/LeftPanel.tsx:436

• Draft comment:
  A divider element was added in the authentication menu section to improve visual separation. Confirm that its styling is consistent with the design system.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50% None

4. web-app/src/containers/auth/AuthLoginButton.tsx:31

• Draft comment:
  The panel width update logic uses 'document.querySelector("aside[ref]")', which may not reliably select the intended element since React refs aren’t rendered as DOM attributes. Consider using a dedicated data attribute or ref callback for more reliable selection.
• Reason this comment was not posted:
  Decided after close inspection that this draft comment was likely wrong and/or not actionable: usefulness confidence = 20% vs. threshold = 50% While the comment correctly identifies an issue with the first selector, the code already has fallback mechanisms that will work. The 'aside[ref]' selector will simply fail silently and move to the next option. The code will still work reliably through its fallbacks. The comment suggests using a data attribute, but that would just be a style preference since the current code already handles failure cases. The code could be simplified by removing the unreliable selector entirely. Why have a selector that we know won't work? While removing the selector would be cleaner, its presence doesn't affect functionality due to the fallbacks. The comment is suggesting a refactor that isn't strictly necessary. The comment identifies a real issue but the code already handles it gracefully through fallbacks. The suggested change would be a minor optimization at best.

Workflow ID: wflow_qK2RmbP9HaaJsZa5

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}

[ellipsis-dev]

Important

Looks good to me! 👍

Reviewed 4ba99e1 in 2 minutes and 2 seconds. Click for details.

• Reviewed 171 lines of code in 4 files
• Skipped 0 files when reviewing.
• Skipped posting 6 draft comments. View those below.
• Modify your settings and rules to customize what types of comments Ellipsis leaves. And don't forget to react with 👍 or 👎 to teach Ellipsis.

1. web-app/src/containers/LeftPanel.tsx:141

• Draft comment:
  Including 'open' in the useEffect dependency array ensures the latest state is used in handleResize. Double-check that reattaching the resize listener on every 'open' change is the intended behavior.
• Reason this comment was not posted:
  Comment did not seem useful. Confidence is useful = 0% <= threshold 50% The comment is asking the PR author to double-check their intention regarding the useEffect dependency array. This violates the rule against asking the author to confirm their intention or to double-check things. Therefore, this comment should not be approved.

2. web-app/src/containers/auth/UserProfileMenu.tsx:15

• Draft comment:
  Unused imports (Button and IconChevronDown) were removed. Confirm that these removals align with the updated UI requirements.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50% None

3. web-app/src/hooks/useThreadScrolling.tsx:165

• Draft comment:
  The debounced scroll handler (debouncedScroll) is added without canceling any pending invocations on unmount. Consider calling debouncedScroll.cancel() in the cleanup to avoid potential state updates after unmount.
• Reason this comment was not posted:
  Comment was not on a location in the diff, so it can't be submitted as a review comment.

4. web-app/src/hooks/useThreadScrolling.tsx:144

• Draft comment:
  The logic in handleScroll and handleDOMScroll is nearly identical. Consider refactoring them into a single shared scroll handler to reduce duplication and potential maintenance issues.
• Reason this comment was not posted:
  Comment was on unchanged code.

5. web-app/src/hooks/useThreadScrolling.tsx:167

• Draft comment:
  The debouncedScroll event listener is attached with an empty dependency array. Verify that the function’s closure does not capture stale state, which might affect its behavior over time.
• Reason this comment was not posted:
  Confidence changes required: 50% <= threshold 50% None

6. web-app/src/providers/AuthProvider.tsx:31

• Draft comment:
  Wrapping fetchUserData and resetAppData in useCallback improves dependency management. Ensure that all necessary dependencies are included and that their stability is maintained.
• Reason this comment was not posted:
  Confidence changes required: 0% <= threshold 50% None

Workflow ID: wflow_NGc2NGtCsoMnpI0c

^{You can customize by changing your verbosity settings, reacting with 👍 or 👎, replying to comments, or adding code review rules.}

[github-actions]

Barecheck - Code coverage report

Total: 30.05%

Your code coverage diff: -0.06% ▾

Uncovered files and lines

File	Lines
web-app/src/containers/LeftPanel.tsx	94-97, 109, 112-116, 119-130, 172, 188-190, 192-200, 210, 213-214, 218, 237, 250-256, 258-259, 270, 275-281, 283-299, 301-302, 304, 309-337, 339-354, 356-357, 361-373, 375-386, 390-400, 434-438, 440, 442, 444, 451, 461
web-app/src/containers/auth/AuthLoginButton.tsx	6-10, 12, 18, 20-26, 28, 30-31, 33-39, 41-42, 45-49, 51-55, 57-67, 69-76, 78-80, 82-88, 90-98, 100-107, 109-115, 117-119, 121
web-app/src/containers/auth/UserProfileMenu.tsx	6-7, 15-20, 22-28, 30-31, 33-39, 41-42, 45-49, 51-55, 57-58, 60-70, 72-74, 76-82, 84-90, 92-103, 105-122, 124-130, 132
web-app/src/hooks/useThreadScrolling.tsx	1-5, 7-24, 26, 28-35, 37-39, 41-42, 45-46, 49-56, 58-65, 67-69, 71-73, 75-77, 80, 82-85, 88, 90-104, 106-108, 112, 114-115, 117, 119-124, 127-129, 132-142, 144-146, 148-149, 152-153, 156-163, 165, 167-173, 175, 178-186, 188-192
web-app/src/providers/AuthProvider.tsx	6-15, 21-24, 27-28, 31-34, 37-38, 41-44, 46-50, 53, 55-57, 60-61, 64-65, 68-69, 72-73, 75-79, 81-84, 86, 88-93, 95-96, 99-102, 104, 106-107, 110, 112-113, 117, 119, 121-123, 125-128, 131, 133-135, 137, 139-142, 144-145