diff options
| author | yyamashita <yyamashita@mosquit.one> | 2026-05-15 00:08:25 +0900 |
|---|---|---|
| committer | yyamashita <yyamashita@mosquit.one> | 2026-05-15 00:08:25 +0900 |
| commit | 1a8a159a71fd018bab0e14d9df952c53ae5ea062 (patch) | |
| tree | e49843e7b1178e063b7f7fd3ad05601affdbfd28 /app/routes/artist-index.tsx | |
| parent | 83524404e891cf256e191677e1150e853e185155 (diff) | |
Add bands/artists index pages and redirect top page
- / now redirects to /bands
- /bands shows band list with "+ Band" link
- /artists shows artist list with "+ Artist" link
- Nav simplified to Bands / Artists only
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Diffstat (limited to 'app/routes/artist-index.tsx')
| -rw-r--r-- | app/routes/artist-index.tsx | 33 |
1 files changed, 33 insertions, 0 deletions
diff --git a/app/routes/artist-index.tsx b/app/routes/artist-index.tsx new file mode 100644 index 0000000..9981567 --- /dev/null +++ b/app/routes/artist-index.tsx @@ -0,0 +1,33 @@ +import { Link, useLoaderData } from "react-router"; +import { listArtists } from "~/lib/db.server"; + +export function loader() { + return { artists: listArtists() }; +} + +export default function ArtistIndex() { + const { artists } = useLoaderData<typeof loader>(); + return ( + <main> + <div className="page-header"> + <h1>Artists</h1> + <Link to="/artists/new">+ Artist</Link> + </div> + + {artists.length === 0 ? ( + <p className="muted"> + アーティストがまだありません。{" "} + <Link to="/artists/new">追加する</Link> + </p> + ) : ( + <ul className="band-list"> + {artists.map((artist) => ( + <li key={artist.id}> + <Link to={`/artists/of/${artist.id}`}>{artist.name}</Link> + </li> + ))} + </ul> + )} + </main> + ); +} |
