Hive.tsx

import styles from './Directory.module.css';

import type { Component } from 'solid-js';
import { For } from 'solid-js';

interface HiveProps {
  database: Database;
}

interface Database {
  entries: DatabaseEntry[];
  tags: string[];
}

interface DatabaseEntry {
  name: string;
  link: string;
  summary: string;
  tags: string[];
}

const Hive: Component = (props: HiveProps) => {
  return (
    <>
      <ul>
        <For each={ props.database.entries }>
          { (item, index) => (
            <>
              <h3><a href={ item.link }>{ item.name }</a></h3>
              <p>{ item.summary }</p>
            </>
          ) }
        </For>
      </ul>
    </>
  );
};

export default Hive;