Fix load on enter

[AbhiramTadepalli]

Overview

After https://github.com/UTDNebula/utd-trends/pull/298/files, since searching is initiated quicker, user feels some lag while waiting for search results

What Changed

Set the loading state quicker, and add a loading icon in the search button

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Comments	Updated (UTC)
utd-trends	✅ Ready (Inspect)	Visit Preview	💬 Add feedback	Nov 27, 2024 6:52pm

[AbhiramTadepalli]

I am calling setSearchResultsLoading() inside the useEffect that has searchResultsLoading as a dependency. Is this bad practice?

[AbhiramTadepalli]

I don't really like the solution. It works but it introduces an unnecessary state I feel like combining it with results.state is probable better but idk how to fully.

[AbhiramTadepalli]

Another problem:

On search from landing page to dashboard, it calls DashboardEmpty and then DashboardError before the searchResultsTable Skeletons

If I modify:

    contentComponent = <DashboardEmpty />;```
and Remove the DashboardError elseif, then for a second, it shows the "No Results" state from searchResultsTable.tsx

Ideally:
Initiate search from landing -> directly shows srt's loading state, nothing in between

[TyHil]

Can revert but lmk what you think of these changes to use results.state and remove the flashing DashboardError and DashboardEmpty.

Opinion: I don't feel the spinner in the search bar is all that necessary when the whole page changes to a loading state.

Current issue (possibly unsolvable): There's also an issue when reloading/opening the dashboard (but not when navigating to it from the homepage) where the searchResultsTable and RHS cards flash white. I seems this is just in the split second before CSS is loaded but it is odd

[TyHil]

Opinion: I don't feel the spinner in the search bar is all that necessary when the whole page changes to a loading state.

nvm the spinners grown on me

Current issue (possibly unsolvable): There's also an issue when reloading/opening the dashboard (but not when navigating to it from the homepage) where the searchResultsTable and RHS cards flash white. I seems this is just in the split second before CSS is loaded but it is odd

solved via a new MUI feature

the topMenu does still jump around because CSS seems to be rendering it as mobile first and it doesn't update until JS is run. there might be a css solution

[TyHil]

the topMenu does still jump around because SSR seems to be rendering it as mobile first because of the media query it uses. there might be a css solution

solved! turns out using an actual media query instead of useMediaQuery fixes this. Probably since CSS is faster than JS

[AbhiramTadepalli]

• Do not search when user clicks on an autocomplete suggestion
• If you type out cs 1200, space, cs2337, space, clicking enter does not search

[AbhiramTadepalli]

Everything else works perfectly. Searches appear faster because there is less lag in between and code-wise it's very simple

[TyHil]

Do not search when user clicks on an autocomplete suggestion
If you type out cs 1200, space, cs2337, space, clicking enter does not search

I think #298 caused both of these issues as they are present on that PR, dev, and prod.