Add playground (#16)

Fixes #15

(for concerns about `lib/books.ts` please review !14)

Co-authored-by: Jared He <66887902+jaredjhe@users.noreply.github.com>
Reviewed-on: #16
Reviewed-by: Amy <a258wang@csclub.uwaterloo.ca>
main
Jared He 8 months ago
parent 2040c63311
commit c642a08a08
  1. 11
      components/Detail.tsx
  2. 21
      components/List.tsx
  3. 33
      pages/index.tsx
  4. 32
      pages/playground.tsx

@ -0,0 +1,11 @@
import React from "react";
import { DetailedBook } from "../lib/books";
export default function Detail(props: Props) {
return <p>{props.book.title}</p>;
}
interface Props {
book: DetailedBook;
}

@ -0,0 +1,21 @@
import React from "react";
import { SimpleBook } from "../lib/books";
export default function List(props: Props) {
return (
<ul>
{props.books.map((book, idx) => {
return (
<li key={`${idx}_${book.id}`}>
{book.id}; {book.title}; {book.authors}; {book.isbn}
</li>
);
})}
</ul>
);
}
interface Props {
books: SimpleBook[];
}

@ -1,34 +1,5 @@
import React from "react";
import { getBook, getAllBooks, DetailedBook, SimpleBook } from "../lib/books";
export default function Home(props: Props) {
return (
<div>
<ul>
{props.books.map((book, idx) => {
return (
<li key={`${idx}_${book.id}`}>
{book.id}; {book.title}; {book.authors}; {book.isbn}
</li>
);
})}
</ul>
<p>{props.book.title}</p>
</div>
);
}
interface Props {
book: DetailedBook;
books: SimpleBook[];
}
export async function getServerSideProps() {
return {
props: {
book: await getBook(44),
books: await getAllBooks(),
},
};
export default function Home() {
return <div></div>;
}

@ -0,0 +1,32 @@
import React from "react";
import Detail from "../components/Detail";
import List from "../components/List";
import { DetailedBook, SimpleBook, getBook, getAllBooks } from "../lib/books";
export default function Playground(props: Props) {
return (
<div>
<h1>Detail</h1>
<hr />
<Detail book={props.book} />
<h1>List</h1>
<hr />
<List books={props.books} />
</div>
);
}
export async function getServerSideProps() {
return {
props: {
book: await getBook(44),
books: await getAllBooks(),
},
};
}
interface Props {
book: DetailedBook;
books: SimpleBook[];
}
Loading…
Cancel
Save