Restructure Search Variable - )#58)

stanleyowen · Aug 30, 2021 · ab1d2be · ab1d2be
1 parent 91de541
commit ab1d2be
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 10 deletions.
diff --git a/src/components/base.component.tsx b/src/components/base.component.tsx
@@ -9,7 +9,7 @@ const BaseLayout = ({ song, config, properties, handleSong }: any) => {
             { properties.activeTab === 'home' ?
                     <Home properties={properties} handleSong={handleSong} config={config} song={song} /> :
                     properties.activeTab === 'search' ?
-                        <Search properties={properties} handleSong={handleSong} /> :
+                        <Search properties={properties} handleSong={handleSong} config={config} /> :
                         <About /> }
         </div>
     )

diff --git a/src/components/search.component.tsx b/src/components/search.component.tsx
@@ -1,17 +1,16 @@
 import React, { useState, useEffect } from 'react'
 import algoliasearch from 'algoliasearch'
 import { Skeleton } from '@material-ui/lab'
+import { initializeApp } from 'firebase/app'
 import { Close } from '../lib/icons.component'
 import { TextField, IconButton } from '@material-ui/core'
 
-const Search = ({ properties }: any) => {
+const Search = ({ properties, config }: any) => {
     const items: any = []
+    const [results, setResult] = useState<any>()
+    const [rawData, setRawData] = useState<any>()
     const [keyword, setKeyword] = useState<string>('')
-    const [data, setData] = useState<any>({
-        isFetching: false,
-        keyword: '',
-        result: ''
-    })
+    const [isFetching, setFetching] = useState<boolean>(false)
 
     useEffect(() => {
         setData({ ...data, isFetching: true})
@@ -36,8 +35,8 @@ const Search = ({ properties }: any) => {
                     </div>
                 )
             }
-        else if (data.result?.length > 0)
-            data.result?.map((music: any, index: any) => {
+        else if (results?.length > 0)
+            results.map((music: any, index: any) => {
                 return items.push(
                     <div className="m-10" key={index}>
                         <a className="large-card" href={music.link}>
@@ -53,7 +52,7 @@ const Search = ({ properties }: any) => {
                     </div>
                 )
             })
-        else if(!data.isFetching && data.result?.length === 0) items.push(<div>No Results Found for <b>{keyword}</b></div>)
+        else if(!isFetching && results?.length === 0) items.push(<div>No Results Found for <b>{keyword}</b></div>)
 
     const ClearQuery = (e: React.MouseEvent<HTMLButtonElement>) => {
         e.preventDefault()