import { useState, useEffect } from 'react' import Head from 'next/head' import App from '../components/App' import styles from '../styles/Home.module.css' export default function Home({ searchText }) { const [apps, setApps] = useState(null) useEffect(() => { fetch('list.json') .then((res) => res.json()) .then((apps) => { setApps(apps) }) }, []) let filteredapps = apps && apps.apps && apps.apps.length > 0 ? [...apps.apps] : []; const lowerSearch = searchText && searchText.toLowerCase(); if (searchText && searchText !== "") { filteredapps = filteredapps.filter((i) => { const category = (i.categories && i.categories.length > 0) ? i.categories.filter((i) => i.toLowerCase().includes(lowerSearch) ) : []; return ( i.name.toLowerCase().includes(lowerSearch) || category.length > 0 ); }); } return (

Kasm Apps

Applications: {apps && apps.appcount}

{filteredapps && filteredapps.length > 0 && filteredapps.map(function (app, i) { return })} {filteredapps && filteredapps.length === 0 && (

No applications found {searchText !== '' && ('matching "' + searchText + '"')}

)}

) }