OmkarK45

import { Tab } from '@headlessui/react'
import clsx from 'clsx'
import React from 'react'
import { IconType } from 'react-icons/lib'

// Gist this
interface Navigation {
	name: string
	icon: IconType | React.ElementType
	component: React.ReactNode

OmkarK45

import { gql, useQuery } from '@apollo/client'
import InfiniteScroll from 'react-infinite-scroll-component'

import { FeedQuery, FeedQueryVariables } from './__generated__/index.generated'

const FEED_QUERY = gql`
	query FeedQuery($first: Int, $after: ID) {
		feed(first: $first, after: $after) {
			edges {
				cursor

OmkarK45

<Container maxW={'3xl'}>
        <Stack
          as={Box}
          textAlign={'center'}
          spacing={{ base: 8, md: 14 }}
          py={{ base: 20, md: 36 }}>
          <Heading
            fontWeight={600}
            fontSize={{ base: '2xl', sm: '4xl', md: '6xl' }}
            lineHeight={'110%'}>

OmkarK45

export default function Home() {
	return (
		<div>
			<div className="relative items-center justify-center">
				<h1 className="p-4 text-2xl font-bold text-center text-gray-400 bg-gray-800">
					Choose Your Next Adventure
				</h1>
				All
				<div className="container items-center mx-auto my-auto lg:flex">
					<div className="mx-8 my-12 bg-white rounded-lg shadow-md lg:m-4 hover:shadow-lg hover:bg-gray-100">

OmkarK45

/*Here's how to use it*/ 
import FancyRoute from "./components/Route/Route"

export default function App(){
  return (
    <Router>
      <FancyRoute path="/" component={Home}/>
    </Router>
  
  )