Hero and Searchbar #1
Conversation
components/Hero.tsx
Outdated
| </div> | ||
| </div> | ||
| </div> | ||
| {showResults && ( |
There was a problem hiding this comment.
Do we need to separate state showResults ? can't we just check the length of results ?
There was a problem hiding this comment.
@chin-flags I used showResults to show data on focus. But I guess I can see if I can do what you suggested.
I tried to map data on results so that it doesnt show more than 3 while rendering.
src/pages/index.tsx
Outdated
| @@ -3,13 +3,14 @@ import Image from "next/image"; | |||
| import { Inter } from "next/font/google"; | |||
| import styles from "@/styles/Home.module.css"; | |||
| import Text from "../../components/Text"; | |||
| import Hero from "../../components/Hero"; | |||
|
|
|||
| const inter = Inter({ subsets: ["latin"] }); | |||
|
|
|||
| export default function Home() { | |||
There was a problem hiding this comment.
minor inconstancy;
here its a regular function and Hero is an arrow function
There was a problem hiding this comment.
@chin-flags Thank you for pointing out. I ended up using the starter code on this that is why the inconsistency.
| @@ -0,0 +1,5 @@ | |||
| export interface DummyData { | |||
There was a problem hiding this comment.
can there be overlaps ? examples:
can an item in trendingNow also be in editorsPicks ? and a given item in trendingNow falls under a certain category ?
There was a problem hiding this comment.
@chin-flags yes there can be overlaps on data but I currently don't know how the data will be. Is there any method you'd suggest?
There was a problem hiding this comment.
make sense!. we can always update this interface once we have more clarity
|
According to @chin-flags 's review. I have done the following:
|
This is my progress on the hero and searchbar: