From 9d8c582cf85e0a1a2ca96591304a88c750f71fa1 Mon Sep 17 00:00:00 2001 From: AbhiramTadepalli Date: Sun, 5 Jan 2025 18:02:44 -0600 Subject: [PATCH 1/2] remove dark mode loading spinner color --- src/components/search/SearchBar/searchBar.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/search/SearchBar/searchBar.tsx b/src/components/search/SearchBar/searchBar.tsx index 435858fe..3d43dd53 100644 --- a/src/components/search/SearchBar/searchBar.tsx +++ b/src/components/search/SearchBar/searchBar.tsx @@ -352,7 +352,7 @@ const SearchBar = ({ onClick={() => onSelect_internal(value)} > {resultsLoading === 'loading' ? ( - + ) : ( 'Search' )} From ddd8798420149208a8bd9f28a7b31faf1ee0e4d4 Mon Sep 17 00:00:00 2001 From: AbhiramTadepalli Date: Sun, 5 Jan 2025 18:08:06 -0600 Subject: [PATCH 2/2] Add loading to the homescreen SearchBar --- src/pages/index.tsx | 11 ++++++++++- 1 file changed, 10 insertions(+), 1 deletion(-) diff --git a/src/pages/index.tsx b/src/pages/index.tsx index a8758561..2cd484d3 100644 --- a/src/pages/index.tsx +++ b/src/pages/index.tsx @@ -2,7 +2,7 @@ import type { NextPage } from 'next'; import Head from 'next/head'; import Image from 'next/image'; import { useRouter } from 'next/router'; -import React, { useEffect } from 'react'; +import React, { useEffect, useState } from 'react'; import Background from '@/../public/background.png'; import SearchBar from '@/components/search/SearchBar/searchBar'; @@ -11,6 +11,8 @@ import { searchQueryLabel, } from '@/modules/SearchQuery/SearchQuery'; +import type { GenericFetchedData } from './dashboard'; + /** * Returns the home page with Nebula Branding, waved background, and SearchBar Components */ @@ -29,6 +31,11 @@ const Home: NextPage = () => { } } + const [results, setResults] = useState>({ + state: 'done', + data: [], + }); // essentially a dummy state. Used only for the loading animation to start in homescreen before navigation to the dashboard + useEffect(() => { router.prefetch('/dashboard'); }, [router]); @@ -73,6 +80,8 @@ const Home: NextPage = () => { // eslint-disable-next-line jsx-a11y/no-autofocus autoFocus={true} onSelect={searchOptionChosen} + resultsLoading={results.state} + setResultsLoading={() => setResults({ state: 'loading' })} input_className="[&>.MuiInputBase-root]:bg-white [&>.MuiInputBase-root]:dark:bg-haiti" />